<!DOCTYPE html>
<html lang="zh"xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
<title>首页 - 天才(genius)后台管理系统</title>
<link rel="icon" th:href="@{favicon.ico}" type="image/ico">
  <link href="css/bootstrap.min.css" th:href="@{~/css/bootstrap.min.css}" rel="stylesheet">
  <link href="css/materialdesignicons.min.css" th:href="@{~/css/materialdesignicons.min.css}" rel="stylesheet">
  <link href="css/style.min.css" th:href="@{~/css/style.min.css}" rel="stylesheet">

</head>
<style>
  #aaa th{ text-align: center }
  #aaa td{ text-align: center }
</style>
<body>
<div class="lyear-layout-web">
  <div class="lyear-layout-container">
    <!--左侧导航-->
    <aside th:include="left::common" class="lyear-layout-sidebar">
    </aside>
    <!--End 左侧导航-->
    <!--头部信息-->
    <header th:include="head :: common" class="lyear-layout-header">
    </header>
    <!--End 头部信息-->
    <!--页面主要内容-->
    <main class="lyear-layout-content">

      <div class="col-md-2" style="float: right; margin-top: 10px" >
        <a href="/study-employee/get/empadd"><button class="btn btn-success btn-w-md" type="button">新增员工</button></a>
      </div>
      <form id="biao" action="/study-employee/list" style="margin: 15px">
        <div th:include="study_pageing_head::common"></div>
    </form>
      <table class="table" id="aaa">
        <thead >
        <tr>
          <th>#</th>
          <th>员工名字</th>
          <th>员工状态</th>
          <th>所属部门</th>
          <th>角色</th>
          <th>操作</th>
        </tr>
        </thead>
        <tbody th:each="emp:${pInfo.list}" >
        <tr   th:class="${emp.empState!=1?'active':'success'}">
        <th th:text="${emp.id}"></th>
        <td th:text="${emp.empName}"></td>
        <div th:switch="${emp.empState}">
          <th th:case="1" style="color:green">在职</th>
          <th th:case="2" style="color:orange">离职</th>
          <th th:case="3" style="color:red">辞退</th>
        </div>
        <td th:text="${emp.studyDepartment.depName}"></td>
        <td th:text="${emp.studyRole.roleName}"></td>
          <td th:if="${emp.empState==1}">
            <div class="btn-group">
              <a class="btn btn-xs btn-default"  th:href="@{/study-employee/get/empmodification/}+${emp.id}" title="编辑" data-toggle="tooltip"><i class="mdi mdi-pencil"></i></a>
            </div>
          </td>
        </tr>
        </tbody>
      </table>


      <nav th:include="study_paging :: common">
      </nav>

    </main>
    <!--End 页面主要内容-->
  </div>
</div>

<script type="text/javascript" th:src="@{~/js/jquery.min.js}" src="js/jquery.min.js"></script>
<script type="text/javascript" th:src="@{~/js/bootstrap.min.js}" src="js/bootstrap.min.js"></script>
<script type="text/javascript" th:src="@{~/js/perfect-scrollbar.min.js}" src="js/perfect-scrollbar.min.js"></script>
<script type="text/javascript" th:src="@{~/js/main.min.js}" src="js/main.min.js"></script>

<!--图表插件-->
<script type="text/javascript" th:src="@{~/js/Chart.js}" src="js/Chart.js"></script>
<script type="text/javascript">
  function ym(pn,isLastPage){
  if(pn==0){
    return
  }
      $("#pn").attr("value", pn);
      $("#biao").submit();

  }
$(document).ready(function(e) {
    var $dashChartBarsCnt  = jQuery( '.js-chartjs-bars' )[0].getContext( '2d' ),
        $dashChartLinesCnt = jQuery( '.js-chartjs-lines' )[0].getContext( '2d' );

    var $dashChartBarsData = {
		labels: ['周一', '周二', '周三', '周四', '周五', '周六', '周日'],
		datasets: [
			{
				label: '注册用户',
                borderWidth: 1,
                borderColor: 'rgba(0,0,0,0)',
				backgroundColor: 'rgba(51,202,185,0.5)',
                hoverBackgroundColor: "rgba(51,202,185,0.7)",
                hoverBorderColor: "rgba(0,0,0,0)",
				data: [2500, 1500, 1200, 3200, 4800, 3500, 1500]
			}
		]
	};
    var $dashChartLinesData = {
		labels: ['2003', '2004', '2005', '2006', '2007', '2008', '2009', '2010', '2011', '2012', '2013', '2014'],
		datasets: [
			{
				label: '交易资金',
				data: [20, 25, 40, 30, 45, 40, 55, 40, 48, 40, 42, 50],
				borderColor: '#358ed7',
				backgroundColor: 'rgba(53, 142, 215, 0.175)',
                borderWidth: 1,
                fill: false,
                lineTension: 0.5
			}
		]
	};

    new Chart($dashChartBarsCnt, {
        type: 'bar',
        data: $dashChartBarsData
    });

    var myLineChart = new Chart($dashChartLinesCnt, {
        type: 'line',
        data: $dashChartLinesData,
    });
});
</script>
</body>
</html>